<template>
  <div class="xc-header">
    <van-nav-bar :title="title" @click-left="onBack">
      <template #left>
        <span class="back"></span>
      </template>
      <template #right>
        <slot></slot>
      </template>
    </van-nav-bar>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: [String],
      default: '网上银行'
    },
    bc: {
      type: String,
      default: '#FFF'
    },
    color: {
      type: String,
      default: '#333'
    },
    isBack: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {};
  },
  methods: {
    onBack() {
      if (!this.isBack) {
        this.$emit('leftClick');
      }
    }
  }
};
</script>

<style lang="less">
.xc-header{
  .back {
    width: 1.375rem;
    height: 1.375rem;
    display: inline-block;
    vertical-align: middle;
    background-size: 1.375rem 1.375rem;
    background-image: url('../assets/img/page/chevron@2x.png');
    background-repeat: no-repeat;
  }
}
</style>
